<template>
  <PageWrapper title="批量导入教师信息">
    <div class="flex-row" style="height: 50px;line-height: 50px">
      <ImpExcel  @success="loadDataSuccess" dateFormat="YYYY-MM-DD">
        <a-button class="m-3"> 导入Excel </a-button>
      </ImpExcel>
      <div class="flex-1 flex-row justify-right">
        <a style="line-height: 32px;height: 32px"  href="/resource/excel/excel_teacher_import_model.xlsx" download="excel_teacher_import_model.xlsx"> 下载Excel模版 </a>
        <a-button class="m-3"  v-if="hasPermission('addDept')" type="primary" :disabled="tableListRef.length==0" @click="handleSave"> 保存 </a-button>
      </div>
    </div>
    <BasicTable
      v-for="(table, index) in tableListRef"
      :key="index"
      :title="table.title"
      :columns="table.columns"
      :dataSource="table.dataSource"
    />
    <div class="tips" v-if="tableListRef.length==0">
      <p>操作步骤:</p>
      <p>1.下载并填写Excel模版</p>
      <p>2.选择文件导入Excel</p>
      <p>3.确认信息无误后点击保存</p>
      <p><b>注意：禁止修改Excel表头和表结构，请严格按照示例内容编写表格!</b></p>
    </div>
  </PageWrapper>
</template>
<style lang="css">
.flex-row{
  display: flex;
  align-items: center;
}
.flex-1{
  flex: 1;
}
.justify-right{
  justify-content: right;
}
.tips{
  width: 100%;
  text-align: center;
  font-size: 14px;
  color: #999;
  padding-top: 100px;
}
</style>
<script lang="ts">
  import { defineComponent, ref } from 'vue';
  const { hasPermission } = usePermission();

  import { ImpExcel, ExcelData } from '/@/components/Excel';
  import { BasicTable, BasicColumn } from '/@/components/Table';
  import { PageWrapper } from '/@/components/Page';
  import { usePermission } from "/@/hooks/web/usePermission";
  import { TeacherAddList } from "/@/api/teacher/teacher";
  import { useMessage } from "/@/hooks/web/useMessage";
  import {TaskCenterList} from "/@/api/taskCenter/taskCenter";

  export default defineComponent({
    components: { BasicTable, ImpExcel, PageWrapper },

    setup() {
      const { createMessage } = useMessage();

      let excelData:any[] = [];
      const tableListRef = ref<
        {
          title: string;
          columns?: any[];
          dataSource?: any[];
        }[]
      >([]);

      function loadDataSuccess(excelDataList: ExcelData[]) {
        tableListRef.value = [];
        excelData = excelDataList[0].results;
        console.log('results',excelDataList[0].results);
        for (const excelData of excelDataList) {
          const {
            header,
            results,
            meta: { sheetName },
          } = excelData;
          const columns: BasicColumn[] = [];
          for (const title of header) {
            columns.push({ title, dataIndex: title });
          }
          tableListRef.value.push({ title: sheetName, dataSource: results, columns });
        }
      }
      function handleSave(){
        const create_time = new Date().getTime();
        if(excelData.length>0){
          excelData = excelData.map(item=>{
            return {
              fname:item['姓名'],
              fnumber:item['工号'],
              class:item['部门'],
              type:item['职称'],
              jxks:item['教学课时'],
              jkyjf:item['教科研积分'],
              jkyjsjf:item['教科研建设积分'],
              glyggfwjf:item['管理与公共服务积分'],
              jxks_full_mark:item['教学课时-达标分数'],
              jkyjf_full_mark:item['教科研积分-达标分数'],
              jkyjsjf_full_mark:item['教科研建设积分-达标分数'],
              glyggfwjf_full_mark:item['管理与公共服务积分-达标分数'],
              create_time:Number(create_time/1000),
            }
          })
          TeacherAddList(excelData).then((res:any)=>{
            createMessage.success(`操作成功,跳过${res.error_count}`)
            tableListRef.value = []
          }).catch(()=>{
            createMessage.error('数据导入失败');
          })
        }else {
          createMessage.error('请先导入excel');
        }
      }

      return {
        hasPermission,
        loadDataSuccess,
        tableListRef,
        handleSave,
      };
    },
  });
</script>
